<template>
  <div>
    <div class="flex-main">
      <div class="flex-body">
        <s-time ref="selectTime" @searchTime="searchTime"></s-time>
        <div class="m-box">
          <div class="bd-li" v-for="(item,key) in list">
            <div class="m-head">
              <p>金额:</p>
              <p>{{item.SellMoney}}</p>
            </div>
            <div class="m-text">
              <p>类型:</p>
              <p>{{item.style}}</p>
            </div>
            <div class="m-text">
              <p>名称:</p>
              <p>{{item.CardType}}</p>
            </div>
            <div class="m-text">
              <p>时间:</p>
              <p>{{item.RegisterDate.substr(0,10)}}</p>
            </div>
          </div>
          <no-data v-if="list.length==0" ></no-data>
        </div>
      </div>
      <footer-nav class="flex-bottom" :title="4"></footer-nav>
    </div>


  </div>
</template>
<script>
  import {
    DatetimePicker,
    Toast,
    Popup,
    Picker
  } from 'mint-ui'; //- mint-ui插件
  import selectTime from '@/components/selectTime';
  import {
    getConsumeList,
  } from "@/api/mine.js";
  export default {
    data() {
      return {
        CustomerID: this.$utils.uid,
        start: '',
        end: '',
        list: [],
      }
    },
    methods: {
      searchTime(data) { //子组件点击确认后传值并执行事件
        var data = {
          customer_id: this.CustomerID,
          start: data.startTime,
          end: data.endTime
        }
        this.ConsumeList(data)
      },
      //获取消耗列表
      ConsumeList(data) {
        getConsumeList(data).then(res => {
          this.list = res.list;
        }).catch(error => {
          Toast(error.msg);
        });
      }
    },
    mounted() {
      var data = {
        customer_id: this.CustomerID
      }
      this.ConsumeList(data);
    },
    components: {
      's-time': selectTime
    }
  }

</script>
<style lang="less" scoped src="@/less/mine/myRecord.less">

</style>
